// 拿到要操作的dom
// 取到鼠标在该dom上滑动的距离
// 改变该dom的高度
// 改变视频的播放速度

var speed = document.querySelector('.speed');
var bar = document.querySelector('.speed-bar');
var video = document.querySelector('.flex');

speed.addEventListener('mousemove', function(e) {
    console.log(e)
    var y = e.pageY - speed.offsetTop //offsetTop是获取某个dom机构到浏览器顶部的距离
    var percent = y / speed.offsetHeight //offsetHeight是获取某个元素自身的高
    var max = 4
    var min = 0.4
    var height = Math.round(percent * 100) + '%';
    var playbackRate = percent * (max - min) + min;
    bar.style.height = height;
    bar.textContent = playbackRate.toFixed(2) + '×'
    video.playbackRate = playbackRate;
})